<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户登录</title>
    <link rel="stylesheet" href="../CSS/login-css.css">
    <link rel="stylesheet" href="../CSS/font-awesome.min.css">
</head>
<script src="../js/jquery-3.4.1.min.js"></script>

<body>
<div class="main-div">
    <div class="login-div">
        <div class="logo-div"></div>
        <div class="form-div">
            <div class="parcel-div">
                <form action="${pageContext.request.contextPath}/user?method=login" method="post" class="form1" onsubmit="return false;">
                    <div class="tip-div">
                        <span>公共场所不建议自动登录, 以防账号丢失</span>
                    </div>
                    <div class="account-div">
                        <div class="parcel-div">
                            <span class="fa fa-user-o fa-lg"></span>
                        </div>
                        <input class="account-input" type="text" placeholder="请输入用户名" name="userName" autocomplete="off">
                    </div>
                    <div class="account-tip-div errorClass"></div>
                    <div class="pwd-div">
                        <div class="parcel-div">
                            <span class="fa fa-lock fa-lg"></span>
                        </div>
                        <input class="pwd-input" type="password" placeholder="请输入密码" name="password">
                    </div>
                    <div class="pwd-tip-div errorClass"></div>
                    <div class="button-div">
                        <button type="submit">Login</button>
                    </div>
                    <div class="login-tip-div errorClass">
                        <c:if test="${errorInfo != null}">
                            <span>${errorInfo}</span>
                        </c:if>
                    </div>
                    <div class="text-div">
                        <a href="./register.jsp">免费注册</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">忘记密码</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    $(function(){
        $(".pwd-div").click(function () {
            $(".pwd-tip-div").html("").css("color","red");
        });
        $(".button-div").click(function(){
            if($(".account-input").val()==""){
                $(".account-tip-div").text("请输入账号");
            }
            if($(".pwd-input").val()==""){
                $(".pwd-tip-div").text("请输入密码");
            }
            if($(".account-input").val()!=""){
                $(".account-tip-div").text("");
            }
            if($(".pwd-input").val()!=""){
                $(".pwd-tip-div").text("");
            }
            if($(".pwd-input").val()!=""&&$(".account-input").val()!=""){
                $.ajax({
                    url: "${pageContext.request.contextPath}/user?method=login",
                    type: "POST",
                    data: $(".form1").serialize(),
                    success: function (message) {
                        if (message=="0") {
                            $(".pwd-tip-div").html("账号或密码错误！").css("color","red");
                        }else{
                            location.href="${pageContext.request.contextPath}/homePage.jsp"
                        }
                    },
                    error: function (jqXHR) {
                        alert("失败!");
                    }
                })
            }
        });
    });
</script>

</html>